@import "index";
nm-button {
    display: inline-block;
    >p {
        display: inline-block;
        >button {
            background-color: #f7f7f7de;
            border: 1px solid #d2d2d2a3;
            font-size: 12px;
            padding: 5px 7px;
            border-radius: 1px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            color: #333333;
            transition: all .3s;
            white-space: nowrap;
            >span[class*='icon-'] {
                margin-right: 3px;
            }
            &:hover {
                border-color: #b3b3b3d5;
                color: black;
            }
        }
    }
    &.selected {
        >p {
            >button {
                background: $assist-color;
                border-color: $assist-color;
                color: white;
            }
        }
    }
    &.is-icon {
        >p {
            >button {
                >span {
                    font-size: 16px;
                    margin-right: 0;
                }
            }
        }
    }
    &.outline {
        >p {
            >button {
                border: 0;
                background: transparent;
            }
        }
    }
    &.orange {
        >p>button {
            background-color: $orange-color;
            border: 1px solid $orange-color;
            color: white;
        }
    }
    &.disabled {
        color: #e8e8e8;
        pointer-events: none;
        >p>button {
            border-color: #e8e8e8;
            background-color: white;
            >span[class*="icon-"] {
                color: #e8e8e8;
            }
        }
    }
}